<template>
    <div class="movieItem">
        <div class="movieItem-1">
            <img src="https://img9.doubanio.com/view/photo/s_ratio_poster/public/p2455050536.jpg" alt="">
        </div>
        <div class="movieItem-2">
            <span>大话西游之大圣</span>
            <span>9.2</span>
        </div>
    </div>
</template>

<script>
export default {

}
</script>

<style lang="scss">
    .movieItem{
        display: flex;
        flex-direction: column;
        width: 157px;
        height: 254px;
        border: 1px solid #ccc;
        margin: 12px;
        .movieItem-1{
            display: flex;
            width: 100%;
            height: 220px;
            background-color: yellow;
            overflow: hidden;
            img{
                width: 100%;
            }
        }
        .movieItem-2{
            display: flex;
            flex: 1;
        }
    }
</style>